﻿<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <title>菜单-列表</title>

    <link rel="shortcut icon" href="favicon.ico">
	<link href="css/bootstrap.min.css?v=3.3.5" rel="stylesheet">
    <link href="css/font-awesome.min.css?v=4.4.0" rel="stylesheet">

    <!-- Data Tables -->
    <link href="css/plugins/dataTables/dataTables.bootstrap.css" rel="stylesheet">
    <link href="js/plugins/layui/css/layui.css" rel="stylesheet">
    <link href="css/animate.min.css" rel="stylesheet">
    <link href="css/plugins/toastr/toastr.min.css" rel="stylesheet">
    <link href="js/plugins/gritter/jquery.gritter.css" rel="stylesheet">
    <link href="css/style.min.css?v=4.0.0" rel="stylesheet" />
	<style>
		#layTab .note{width:150px;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;cursor:pointer;}
		.noteAlert{color:red;}
		#layTab tr td:nth-child(4){
			text-align:center;
		}

	</style>
</head>

<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-sm-12">
                <div class="ibox float-e-margins">
<!-- 页面提示 -->
<div class="collapse" id="collapseExample" style="position:absolute;left:30%;">
	<div class="alert alert-warning alert-dismissable" style="padding:8px;margin-bottom:0px;" >
		<button aria-hidden="true" data-dismiss="alert" style="right:0;" class="close" type="button">×</button>
		该页面只允许超级管理员（开发人员）进行增删改！！！
	</div>
</div>
                    <div class="ibox-title" style="height:72px;">

                        <div class="ibox-tools">
							<a class="collapse-link" data-toggle="collapse" href="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
								<i class="fa fa-warning"></i>
							</a>
                            <a class="collapse-link" href="javascript:location.href=location.href;">
                                <i class="fa fa-refresh"></i>
                            </a>
                        </div>
                        <h5>基本 <small>分类/查找</small></h5>
						<div class="col-sm-12">
							<div class="col-sm-10" style="line-height:34px;color:#DAA520;">
								添加菜单时，如果父级菜单的配置路径不为空，则子级菜单不显示在左侧导航栏中，且系统固有的菜单（菜单）无法被删除！！！
							</div>
							<div class="col-sm-2 text-right">
								<button id="showAddMenu" type="button" class="btn btn-sm btn-success add">新增</button>
							</div>
						</div>
                    </div>
                    <div class="ibox-content">

                        <table id="layTab" class="table table-striped table-bordered table-hover dataTables-example" >
                            <thead>
                                <tr>
                                    <th width="120px">菜单名称</th>
                                    <th>菜单代码</th>
                                    <th>配置路径</th>
                                    <th>状态</th>
                                    <th>ICON</th>
                                    <th>排序</th>
                                    <th>创建人</th>
                                    <th>创建时间</th>
                                    <th>更新人</th>
                                    <th>更新时间</th>
									<th width="9%">备注</th>
									<th>操作</th>
                                </tr>
                            </thead>
                            <tbody>
                            </tbody>
							<tfoot>

							</tfoot>
                        </table>

                    </div>

                </div>
            </div>
        </div>

    </div>



    <script src="js/jquery.min.js?v=2.1.4"></script>
    <script src="js/bootstrap.min.js?v=3.3.5"></script>
	<script src="js/plugins/toastr/toastr.min.js"></script>
	<script src="js/plugins/layui/layui.js"></script>
    <script src="js/plugins/gritter/jquery.gritter.min.js"></script>
	<script src="js/custom/layTool.js"></script>
    <script type="text/javascript" src="js/custom/app.js" charset="UTF-8"></script>
    <script type="text/javascript" src="js/custom/tools.js" charset="UTF-8"></script>
    <script>

	function getAllSysMenuList(){
		var url = 'sysMenu/getCascadeSysMenuList';
		jQuery.ajax({
			url:domain + url,
			type:"get",
			data:{},
			crossDomain:true,
			xhrFields:{
				withCredentials:true
			},
			success:function (data) {
				if(data.status == 200){
					combHTML(data.data);
				}else{
                    top.toastr.warning(data.msg);
                }
			},
			error:function(data) {
				top.toastr.error("查询列表失败，请检查网络");
			}
		})

	}

	function combHTML(data){
		var htmls = new Array();
		for (var i=0;i<data.length;i++){
			var sysMenu1 = data[i].sysMenu;
			var sysMenu1List = data[i].sysMenuList;

			htmls.push('<tr>');
			htmls.push('	<td>'+ sysMenu1.mName + getLock(sysMenu1.mCode) +'</td>');
			combSubHTML(htmls ,sysMenu1);

			for(var j=0;j<sysMenu1List.length;j++){
				var sysMenu2 = sysMenu1List[j].sysMenu;
				var sysMenu2List = sysMenu1List[j].sysMenuList;

				htmls.push('<tr>');
				htmls.push('	<td>&nbsp;&nbsp;&nbsp;├&nbsp;'+ sysMenu2.mName + getLock(sysMenu2.mCode) +'</td>');
				combSubHTML(htmls ,sysMenu2);

				for(var k=0;k<sysMenu2List.length;k++){
					var sysMenu3 = sysMenu2List[k].sysMenu;
					//var sysMenu3List = sysMenu2List[j].sysMenuList;  //没有4级菜单

					htmls.push('<tr>');
					htmls.push('	<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;├&nbsp;'+ sysMenu3.mName + getLock(sysMenu3.mCode) +'</td>');
					combSubHTML(htmls ,sysMenu3);

				}

			}

		}
		$("#layTab tbody").html(htmls.join(''));


		//修改菜单
		$(".showUpdateMenu").on("click",function(){
			var menuCode = $(this).data("code");
			layerOpen('修改菜单','menu-edit.html?menuCode='+encodeURI(menuCode),'600','530')
		});

		//删除菜单
		$(".showDeleteMenu").on("click",function(){
			var menuCode = $(this).data("code");
			deleteMenu(menuCode);
		});


	}

	function combSubHTML(htmls ,obj){
		htmls.push('	<td>'+ obj.mCode +'</td>');
		htmls.push('	<td>'+ obj.mUrl +'</td>');
		htmls.push('	<td>'+ getStatus(obj.status) +'</td>');
		htmls.push('	<td>'+ obj.mIcon +'</td>');
		htmls.push('	<td>'+ obj.sort +'</td>');
		htmls.push('	<td>'+ obj.createBy +'</td>');
		htmls.push('	<td>'+ obj.createTime +'</td>');
		htmls.push('	<td>'+ obj.updateBy +'</td>');
		htmls.push('	<td>'+ obj.updateTime +'</td>');
		htmls.push('	<td><div class="note" data-name="'+ obj.mName +'" onClick="showNoteAlert(this)">'+ obj.note +'</div></td>');
		htmls.push('	<td><button type="button" data-code="'+ obj.mCode +'" class="btn btn-xs btn-outline btn-warning showUpdateMenu update">修改</button>');
		htmls.push('	<button type="button" data-code="'+ obj.mCode +'" class="btn btn-xs btn-outline btn-danger showDeleteMenu delete">删除</button></td>');
		htmls.push('</tr>');
	}

	//删除菜单
	function deleteMenu(menuCode){
		layui.use(['layer'], function(){
			var layer = layui.layer;
			layer.confirm('确定删除？', {
				title:false,
				icon:7,
				btn: ["确定",'取消'] //按钮
			}, function(){
				var url = 'sysMenu/deleteSysMenuByCode';
				jQuery.ajax({
					url:domain + url,
					type:"post",
					data:{"menuCode":menuCode},
					crossDomain:true,
					xhrFields:{
						withCredentials:true
					},
					success:function (data) {
						if(data.status == 200){
							top.toastr.success("操作成功");
							getAllSysMenuList();
							layer.close(layer.index);
						}else{
							top.toastr.warning(data.msg);
						}
					},
					error:function(data) {
						top.toastr.error("查询列表失败，请检查网络");
					}
				})
			});
		});
	}

	//显示完整的note信息
	var uid = 0;
	function showNoteAlert(obj){
		uid = $.gritter.add({
			title:'<div style="color:#1ab394;">'+$(obj).data("name")+'</div>',
			text:$(obj).html(),
			time:10000,
			before_open: function(){
				if(uid!=0){
					$.gritter.remove(uid, {
						fade: true, // optional
						speed: 'fast' // optional
					});
				}
			}
		});
	}


	$(function(){
		getAllSysMenuList();
		$("#showAddMenu").on("click",function(){
			layerOpen('新增菜单','menu-add.html','600','530');
		})
	})


	</script>

	<script>	//=======   页面权限显示   ======//
	//当前菜单代码 (每个页面不一样，需要配置)
		var s_menuCode = "menuRun";
	//所有可用权限
		var roleAuth = app.permission(s_menuCode);
	//当前菜单所有可用权限（排除被禁用的按钮）
		var menuAuth = app.menuButtonByOn(s_menuCode);

		drawBtn(roleAuth,menuAuth);
	</script>

</body>

</html>
